/**
 * 公共css变量
 */

page {
	background-color: $color-bg;
}
view,
cover-view,
scroll-view {
	color: $color-text;
	font-size: $font-size;
	box-sizing: border-box;
	font-family: $font-family;
	font-weight: $font-weight;
}
view,
button {
	background-size: 100% 100%;
}

button.primary {
	background-color: #0DC887;
	color: #FFFFFF;
}
/* input-placeholder颜色 */
.phcolor {
	color: $color-grey-light;
}
button {
	padding: 0;
	font-size: 26rpx;
}
button::after{
	border: none;
}

/* 布局 */
.content {
	display: flex;
	flex-direction: column;
}

/* 顶部固定布局，用于筛选条件下占位 */
.fixed_top {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: $z-index-fixed;
	width: auto;
	height: auto;
	background-color: $color-white;
}

/* 固定在底部的区域，用于全选按钮等排放 */
.bottom_blank {
	width: 100%;
	height: 164rpx;
}
.bottom_view {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: $z-index-fixed;
	width: 750rpx;
	height: 144rpx;
	box-shadow: $box-shadow;
	background-color: $color-white;
	display: flex;
	flex-direction: row;
}

/* 文本溢出 */
.text_over {
	display: -webkit-box;
	overflow: hidden;
	white-space: normal;
	text-overflow: ellipsis;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

/* scroll-view 首个box如果有margin-top，则添加此占位box放置view滑动 */
.scroll_blank {
	content: '';
	overflow: hidden;
}

/* 分隔线 */
.separate_line {
	width: 100%;
	height: $spacing-col;
	background-color: $color-bg;
}

/* 没有列表时显示的icon及tip */
.no_lists {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	.img {
		margin-top: 250rpx;
	}
	.tip {
		margin-top: 30rpx;
		color: $color-grey;
	}
}

/* 弹窗 */
._popup {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: $z-index-popup;
	background-color: rgba(0,0,0,.5);
}
/* 弹窗-嵌套在遮罩层中的弹窗 */
._popup.center {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: calc(50vh - 280rpx);
}

/* 确认按钮-底部，用于完成支付或其它操作后的 */
.btn_submit {
	width: 690rpx;
	height: 80rpx;
	line-height: 79rpx;
	text-align: center;
	margin-left: 30rpx;
	margin-right: 30rpx;
	color: $color-white;
	font-size: 30rpx;
	background: $color-primary;
	border-radius: $border-radius-bm;
}
/* 确认按钮下的提示语 */
.tip_submit {
	width: 100%;
	padding: 0 30rpx;
	font-size: 24rpx;
	color: $color-grey;
}

/* 确认按钮-弹窗内部 */
.btn_submit_popup {
	width: 175rpx;
	height: 62rpx;
	line-height: 60rpx;
	text-align: center;
	font-size: 26rpx;
	color: $color-white;
	background: $color-primary;
	border-radius: $border-radius-bm;
}

/* 确认按钮-底部菜单 */
.btn_submit_sm {
	width: 140rpx;
	height: 70rpx;
	line-height: 69rpx;
	text-align: center;
	font-size: 26rpx;
	color: $color-white;
	background-color: $color-primary;
	border-radius: $border-radius-sm;
}

/* 仿照微信原生弹窗，用于在弹窗中显示的取消/确定按钮 */
.btn_view_popup {
	display: flex;
	flex-direction: row;
	border-top: 1rpx solid $color-list;
	._cancle,
	._submit {
		flex: 1;
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
		font-size: 34rpx;
	}
	._cancle {
		border-right: 1rpx solid $color-list;
	}
	._submit {
		color: $color-text-primary;
	}
}

/* 选择按钮-对号，只能使用view */
.check_box._ck1 {
	width: 36rpx;
	height: 36rpx;
	background-image: url('/static/wxImage/selected.png');
}
.check_box._ck2 {
	width: 35rpx;
	height: 35rpx;
	border: 1rpx solid $color-grey-light;
	border-radius: $border-radius-circle;
}

/* 选择按钮-单选项，只能使用view */
._radio {
	width: 26rpx;
	height: 26rpx;
}
._radio._rd1 {
	background-image: url('http://img.etubang.com/group1/M00/00/40/rBCky14VnzOANaWAAAADBEuIAKs692.png');
}
._radio._rd2 {
	border: 1rpx solid $color-grey-light;
	border-radius: $border-radius-circle;
}

/*flex布局*/
.u-f {
	display: flex;
}
.u-f-ac,.u-f-ajc ,.u-f-jsb {
	display: flex;
	align-items: center;
}

.u-f-ajc {
	justify-content: center;
}
.u-f-jsb {
	justify-content: space-between;
}
.u-f-dc {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.gray {
	background-color: rgba(0,0,0,0.1) !important;
}


.fadeIn {
	animation: fadeIn 0.5s;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	80% {
		opacity: 0.88;
	}
	
	100% {
		opacity: 1;
	}
}
